<template>
	<view>
		<view class="banner">
			<u-swiper @click="bannerClick" :list="banner" v-if="banner.length" :height="320" bg-color="#fffff" mode="none" :border-radius="40"></u-swiper>
		</view>
		<view class="title">上传房源</view>
		<!-- 金刚区导航 -->
		<view class="nav-list u-flex u-flex-wrap">
			<view class="item u-flex" v-for="(item,index) in link" :key="index" @click="jump('/pages/agent/push?type=' + index)">
				<image :src="`../static/icon/home${index}.png`"></image>
				<text>{{item.name}}</text>
			</view>
		</view>
		<view class="title">我的房源</view>
		<view class="nav-list u-flex u-flex-wrap">
			<view class="item u-flex" v-for="(item,index) in link" :key="index" @click="jump('/pages/agent/housing?type=' + index)">
				<image :src="`../static/icon/home${index}.png`"></image>
				<text>{{item.name}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				banner: '',
				link:[]
			}
		},
		methods:{
			bannerClick(index){
				this.$app.eventJump(this.banner[index].url)
			},
		},
		created() {
			this.link = this.$app.TYPE_MAP
			this.$u.post('/api/agent/banner').then(res=>{
				this.banner = res
			})
		}
	}
</script>

<style lang="scss">
	// 标题
	.title{padding-left: 30rpx;font-weight: bold;font-size: 32rpx;padding: 30rpx;}
	// banner
	.banner{padding: 30rpx 30rpx 0 30rpx;}
	// 金刚区
	.nav-list{
		background-color: #fff;padding: 30rpx 20rpx 10rpx;box-shadow: 0 0 20rpx #eee;
		.item{width: 25%;flex-direction: column;justify-content: center;
			image{width: 100rpx;height: 100rpx;display: block;}
			text{display: block;text-align: center;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 100%;padding: 14rpx 0;}
		}
	}
</style>
